<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="viewport"
          content="width=device-width, height=device-height, user-scalable=no, initial-scale=1.0, maximum-scale=1.0">

    <script type="text/javascript" src="../ActivityCommon/js/jquery-3.2.1.min.js"></script>
    <script type="text/javascript" src="./js/zepto.js"></script>
    <script type="text/javascript" src="./js/kinerLottery.js"></script>
    <script type="text/javascript" src="../../gmmcActivity/ActivityCommon/js/acivityCommon.js"></script>
    <link rel="stylesheet" href="./css/style.css">
    <title>一路有菱5与伦比</title>
</head>

<body>
<div class="draw_box">
    <img src="./images/draw_bj.png">
    <div id="box" class="box" data-deg="0">
        <div class="outer KinerLottery KinerLotteryContent" style="transition: none; transform: rotate(360eg);"><img
                src="./images/lanren.png"></div>
        <!-- 大专盘分为三种状态：活动未开始（no-start）、活动进行中(start)、活动结束(completed),可通过切换class进行切换状态，js会根据这3个class进行匹配状态 -->
        <div class="inner  start doing" id="KinerLotteryBtn"></div>
        <div class="content">
            <div class="title">
                <img src="images/hdgz.png">
            </div>
            <div class="content_text">
                <p>1. 活动期间购买广汽三菱指定车型即可分享千万礼包一次。（同一手机号码、同一车辆仅参与一次抽奖）</p>
                <p>2. 活动奖项设置：一等奖4999元；二等奖3000元；三等奖1000元。（中奖后自动以积分形式体现在个人中心积分上 1元=1积分）</p>
                <p>3. 积分使用方式：（可多次使用，用完为止）
                <p><img src="images/01.png" alt="01"> 车主积分可在广汽三菱销售服务店进行等额消费（包括：精品加装、保养、维修等）</p>
                <p><img src="images/02.png" alt="02">可在服务号上的积分商城兑换任意等额礼品。</p>
                </p>
                <p>备注：积分自用户注册之日起，每两年重置清零。</p>

            </div>
            <div class="btn" id="my_lz"><img src="images/btn.png" alt="" width="200"></div>
        </div>

    </div>
    <div class="tc" id="tc" style="display:none">
        <div class="tc_jb">
            <form action="" class="fonrm">
                <div class="form_name">
                    <label>姓 名:</label>
                    <input type="text">
                    <span>必填</span>
                </div>
                <div class="form_name">
                    <label>手机号:</label>
                    <input type="text">
                    <span>必填</span>
                </div>
                <div class="form_name">
                    <label>验证码:</label>
                    <input type="text">
                    <span class="obtain">获取</span>
                </div>
                <div class="form_name">
                    <label>省 份：</label>
                    <select id="province" name="selse" class="selse">
                        <option value="">----请选择-----</option>
                    </select>
                    <span><img src="./images/un.png" alt="" width="10"></span>
                </div>
                <div class="form_name">
                    <label>城 市：</label>
                    <select id="city" name="selse" class="selse">
                        <option value="">----请选择-----</option>
                    </select>
                    <span><img src="./images/un.png" alt="" width="10"></span>
                </div>
                <div class="form_name">
                    <label>经销商:</label>
                    <select id="dealer" name="selse" class="selse">
                        <option value="">----请选择-----</option>
                    </select>
                    <span><img src="./images/un.png" alt="" width="10"></span>
                </div>
                <button class="tc_but"><img src="./images/tc_but.png" alt="" width="150"></button>
            </form>
        </div>
        <div class="reveal-modal-bg" style="display: block; cursor: pointer;"></div>

    </div>
</div>
<script>
    var min = 0;
    var max = 0;
    var rootPath = getRootPath();
    $(document).on('click', '#my_lz', function() {
        $('.tc').show(1000);
        $('.reveal-modal-bg').bind('click',function(){
            $('#tc').hide(1000);
        });
    });
    $(function () {

        //异步加载省份数据
        $.ajax({
//			 headers:{'Cookie':document.cookie},
            /* uri=http://${config.ip:10.180.8.212}:${config.port:8888}*/
            url: "http://localhost:9002" + '/pointActivity/api/v1/getProvince',
            contentType: "application/json",
            type: "POST",
            success: function (json) {
                for (var i in json) {
                    var regionCode = i;
                    var regionName = json[i];
                    $("#province").append("<option value='" + regionCode + "'>" + regionName + "</option>");
                }
            }
        });
        //当选择省份后触发此事件
        $("#province").change(function () {
            $("#city option:not(:first)").remove();
            $("#dealer option:not(:first)").remove();
            var regionCode = $(this).val();
            if (regionCode != "") {
                $.ajax({
                    headers: {'Cookie': document.cookie},
                    //url:"http://127.0.0.1:9013/pointActivity/api/v1/city",
                    url: "http://localhost:9002" + "/pointActivity/api/v1/getCity",
                    data: "regionCode=" + regionCode,
                    type: "POST",
                    success: function (json) {
                        for (var a in json) {
                            var cityCode = a;
                            var cityName = json[a];
                            $("#city").append("<option value='" + cityCode + "'>" + cityName + "</option>");
                        }
                    }
                });
            }
        });
        //城市名称发生改变触发事件
        $("#city").change(function () {
            $("#dealer option:not(:first)").remove();
            var cityid = $(this).val();
            if (cityid != "") {
                $.ajax({
//                    headers: {'Cookie': document.cookie},
                    //url:"http://127.0.0.1:9013/pointActivity/api/v1/dealer",
                    url: "http://localhost:9002" + "/pointActivity/api/v1/getDealer",
                    data: "regionCode=" + cityid,
                    type: "POST",
                    success: function (json) {
                        for (var b in json) {
                            var cityCode = b;
                            var cityName = json[b];
                            $("#dealer").append("<option value='" + cityCode + "'>" + cityName + "</option>");
                        }
                    }
                });
            }
        });
        //经销商名称发生改变触发事件
//        $("#dealer").change(function () {
//            $("#model option:not(:first)").remove();
//            var dealerCode = $(this).val();
//            if (dealerCode != "") {
//                $.ajax({
////                    headers: {'Cookie': document.cookie},
//                    //url:"http://127.0.0.1:9013/pointActivity/api/v1/dealer",
//                    url: "http://localhost:9002" + "/pointActivity/api/v1/getModel",
//                    data: "regionCode=" + dealerCode,
//                    type: "POST",
//                    success: function (json) {
//                        for (var b in json) {
//                            var dealerCode = b;
//                            var dealerName = json[b];
//                            $("#model").append("<option value='" + dealerCode + "'>" + dealerName + "</option>");
//                        }
//                    }
//                });
//            }
//        });
        var province = null;
        var city = null;
        var dealerCode = null;
        var model = null;
        var reservedate = null;

        //意向按键点击事件.pic submit-btn auto >img
        $("#sub").click(function () {
            province = $("#province").val();
            city = $("#city").val();
            dealerCode = $("#dealer").val();
            model = $("#model").val();
            reservedate = $("#datecontrl").val();

            if (province == "0") {
                showAlert("请选择省份");
                return;
            }
            if (city == "0") {
                showAlert("请选择城市");
                return;
            }
            if (dealerCode == "0") {
                showAlert("请选择经销商");
                return;
            }
            if (model == "0") {
                showAlert("请选择意向车型");
                return;
            }

            showConfirm();
        });

        //显示提示是否提交方法
        function showConfirm() {
            $(".model").hide();
            $(".model-3").show();
            //选择否
            $("#not").click(function () {
                $(".model-3").hide();
                $(".model").show();
            });
            //选择是
            $("#yes").click(function () {
                $("#yes").unbind();
                Save();
            });
        }
        function Save(){
            $.ajax({
                headers:{'Cookie':document.cookie},
                //url:"http://127.0.0.1:9013/pointActivity/api/v1/verification",
                url:"http://localhost:9102" + "/pointActivity/api/v1/verification",
                type:"POST",
                data:{"province":province,"city":city,"dealerCode":dealerCode},
                beforeSend: function(){
                    $("#sub").unbind(); //取消事件
                },
                success:function(json){
                    if(json.message=="重复提交异常"){
                        showAlert("您已提交成功,请勿重复提交");
                        $(".model-3").hide();
                        $(".model").show();
                        //取消提交按键事件
                        $("#sub").unbind();
                        //再次点击事件
                        $("#sub").click(function(){
                            showAlert("您已提交成功,请勿重复提交");
                        });
                    }else if(json.message=="保存成功"){
                        $(".model-3").hide();
                        $(".model").hide();
                        $(".model-2").show();
                        //显示成功信息1秒后自动隐藏
                        //setTimeout(function(){$(".model-2").hide();},1000);
                        $(".model-2").click(function(){
                            $(".model-2").hide()
                        })
                        $(".model").show();
                        //取消提交按键事件
                        $("#sub").unbind();
                        //再次点击事件
                        $("#sub").click(function(){
                            showAlert("您已提交成功,请勿重复提交");
                        });
                    }else{
                        showAlert(json.message);
                        $(".model-3").hide();
                        $(".model").show();
                    }
                },complete: function(){
                    $("#sub").bind();  //绑定事件
                },
                error:function(e){
                    showAlert(e);
                }
            });
        }

    })

</script>
</body>
</html>